<script setup lang="ts">
import { ref } from "vue";
import Child from "./Child.vue";

const count = ref(0);

const handleClick = () => {
  count.value++;
};
</script>

<template>
  <h1>App</h1>
  <p>{{ count }}</p>
  <!-- 
    vue3中默认给组件绑定事件是DOM事件(vue3移除了.native事件修饰符)
      需要满足两个前提：
        1. 子组件必须有根标签
        2. 事件名得是DOM事件名

    要绑定自定义事件，子组件内部声明接受事件，事件就是自定义事件
   -->
  <Child @click="handleClick" />
</template>

<style scoped></style>
